// GuideMask.ts
import { _decorator, Component, Graphics, director, Color, Vec3, Node, Mask, math, view, UITransform } from 'cc';
import { GuideEvent } from './GuideEvent';
const { ccclass } = _decorator;

@ccclass('GuideMask')
export class GuideMask extends Component {
    private graphics: Graphics = null!;

    private sprit:Node = null

    onLoad() {
        // this.graphics = this.getComponent(Graphics)!;
        // if (!this.graphics) {
        //     console.error("Graphics 组件未找到");
        //     return;
        // }
        // this.graphics.enabled = true; // 确保组件启用
        this.sprit = this.node.getChildByName('SpriteSplash')

        // 监听事件
        director.on(GuideEvent.SHOW_MASK, this.show, this);
        // director.on(GuideEvent.HIDE_MASK, this.hide, this);
    }

    onDestroy() {
        // 取消监听
        director.off(GuideEvent.SHOW_MASK, this.show, this);
        director.off(GuideEvent.HIDE_MASK, this.hide, this);
    }

    private show(targetNode: Node, shape: string) {
        const worldPos = targetNode.getWorldPosition();
        console.log("目标节点世界坐标:", worldPos);
        this.drawHole(worldPos, shape);

    }

    private hide() {
        this.graphics.clear();
    }

    private drawHole(pos: Vec3, shape: string) {
        const screenSize = view.getVisibleSize()
        this.sprit.getComponent(UITransform).setContentSize(screenSize)
            console.log('绘制了');
            const ctx = this.node.getComponent(Graphics);
            if(!ctx){
                console.log('节点不存在')
            }

            // this.graphics.clear();
            // this.graphics.fillColor = new Color(0, 0, 0, 180); // 半透明黑色
            // this.graphics.rect(0, 0, screenSize.width, screenSize.height); // 全屏遮罩
            // console.log("屏幕尺寸", screen.width, screen.height);
            // this.graphics.fill();
            // // this.graphics.fillColor = Color.TRANSPARENT;
            // // this.graphics.fillColor = new Color(0, 0, 0, 0);
            // if (shape === 'circle') {
            //     this.graphics.circle(Math.floor(pos.x),Math.floor( pos.y), 50); // 圆形高亮
            // } else {
            //     this.graphics.rect(Math.floor(pos.x)- 100, Math.floor( pos.y)- 50, 200, 100); // 矩形高亮
            // }
            // this.graphics.fill();

            // 将节点移动到屏幕左下角
            this.node.setPosition(-screenSize.width / 2, -screenSize.height / 2);
    }
}